<template>
	<view>
		<view class="btnContent">
			<view class="btn" @click="haveLimitsCode">有限制的小程序码</view>
			<view class="btn" @click="nothingLimitsCode">不限制的小程序码</view>
			<view class="btn" @click="programQrcode">小程序二维码</view>
		</view>
		<view class="imageBox">
			<image :src="dataObj.qrCode"></image>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		ref,
		reactive,
		inject
	} from 'vue'
	// import {  } from '../../api/index.js'

	const tools = inject("$tools")
	const title = ref('顶部')
	const dataObj = reactive({
		access_token: '',
		expires_in: '',
		qrCode: ''
	})

	onLoad((opt) => {
		console.log('opt',opt);
		
		if(opt.key){  // 有限制小程序码、小程序二维码
			tools.toast(`有限制、二维码：${opt.key}`)
		}else if(opt.scene){  // 无限制小程序码
			let params = decodeURIComponent(opt.scene)
			tools.toast(`无限制：${params}`)
		}else if(opt.q){  // 普通二维码
			
			// tools.toast(`二维码：${opt.cc}`)
		}

		proof()
	})
	
	// 接口调用凭证
	const proof = () => {
		uni.request({
			url: 'https://api.weixin.qq.com/cgi-bin/token',
			data: {
				grant_type: 'client_credential',
				appid: 'wx579ee6f0fcd28f17',
				secret: 'd0e510e39bc81a4e48c41930b52ee248'
				// appid:'wx636f4ff067f797b1',  // 顺康久
				// secret: '5cc64b12bd1a3f85eaa4be160febe165'  // 顺康久
			},
			success: (res) => {
				dataObj.access_token = res.data.access_token
				dataObj.expires_in = res.data.expires_in
			}
		});
	}
	
	// 获取有限制的小程序码
	const haveLimitsCode = () => {
		uni.request({
			url: `https://api.weixin.qq.com/wxa/getwxacode?access_token=${dataObj.access_token}`,
			method: 'POST',
			responseType: 'arraybuffer', // 设置响应的数据类型。必要的
			data: {
				path: `pages-sub/qrcode/qrcode?key=${333}`,
				env_version: 'trial', // release：正式版  trial：体验版  develop：开发版
			},
			success: (res) => {
				let base64 = uni.arrayBufferToBase64(res.data)
				// console.log('res',base64);
				dataObj.qrCode = `data:image/PNG;base64,${base64}`
			}
		});
	}

	// 获取无限制的小程序码
	const nothingLimitsCode = () => {
		uni.request({
			url: `https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=${dataObj.access_token}`,
			method: 'POST',
			responseType: 'arraybuffer', // 设置响应的数据类型。必要的
			data: {
				page: "pages-sub/qrcode/qrcode",  // pages/index/index
				scene: '666',
				check_path: false, // 默认是true，检查page 是否存在，为 true 时 page 必须是已经发布的小程序存在的页面（否则报错）；为 false 时允许小程序未发布或者 page 不存在， 但page 有数量上限（60000个）请勿滥用。
				env_version: 'trial', // release：正式版  trial：体验版  develop：开发版
			},
			success: (res) => {
				let base64 = uni.arrayBufferToBase64(res.data)
				// console.log('base64',base64);
				dataObj.qrCode = `data:image/PNG;base64,${base64}`
			}
		});
	}
	
	// 获取小程序二维码。需要发布
	const programQrcode = () => {
		uni.request({
			url: `https://api.weixin.qq.com/cgi-bin/wxaapp/createwxaqrcode?access_token=${dataObj.access_token}`,
			method: 'POST',
			responseType: 'arraybuffer', // 设置响应的数据类型。必要的
			data: {
				path: `pages-sub/qrcode/qrcode?key=${999}`,  // pages/index/index
			},
			success: (res) => {
				let base64 = uni.arrayBufferToBase64(res.data)
				console.log('base64',base64);
				dataObj.qrCode = `data:image/PNG;base64,${base64}`
			}
		});
	}
</script>

<style lang="scss" scoped>
	.btnContent {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		padding: 30rpx;
		border-bottom: 1px solid #aaa;

		.btn {
			color: #fff;
			padding: 20rpx;
			margin: 20rpx 0;
			border-radius: 30rpx;
			background-color: pink;
			box-shadow: 0 0 8rpx 0 #aaa;
		}
	}

	.imageBox {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 60rpx 0;

		image {
			border-radius: 8rpx;
			width: 500rpx;
			height: 500rpx;
			box-shadow: 0 0 16rpx 2rpx #aaa;
		}
	}
</style>